﻿<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>用户下单</title>
	<meta name="robots" content="all" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
	<link rel="stylesheet" href="../css/common/common.css">
	<link rel="stylesheet" href="../css/common/timepicker.css">
	<link rel="stylesheet" type="text/css" href="../css/component/component.css">
	<link rel="stylesheet" href="../css/order.css">
</head>
<body>
	<div class="wrapper" id="wrapper">
		<header class="head">
			<div class="headTitle">
				<div class="headTitleContent">
					<div class="headTitleLeft">
						<a href="#">首页</a>
						<a href="#">预约中心</a>
						<a href="#">专家团队</a>
						<a href="#">特色诊疗</a>
						<a href="#">病案分享</a>
						<a href="#">健康咨询</a>
						<a href="#">报告查询</a>
						<a href="#">关于我们</a>
					</div>
					<div class="headTitleRight">
						<span class="headTitleRightName">欢迎，程国庆</span>
						<span class="headTitleRightBack">[退出]</span>
					</div>
				</div>
			</div>
			<div class="headCompanyIn">
				<h1><img src="../image/loginLogo.png"></h1>
				<div>
					<h2>免费热线400-110-8102</h2>
					<p>周一至周日8:00-17:00</p>
				</div>
			</div>
		</header>
		<div class="expertInformationBox">
			<h1 class="expertTitle">
				<a href="javascript:;">专家信息</a>
			</h1>
			<div class="expertDoctor">
				<h1 class="expertPic"><img src="../image/doctor.png"></h1>
				<div class="expertInformation">
					<h1><b>宋冬雷</b><span>外科-主任医师</span></h1>
					<p>上海瑞金医院</p>
					<div>￥<i>500</i></div>
					<a href="javascript:;" class="appointmentBtn">立即预约</a>
				</div>
				<div class="beGoodAtBox">
					<p class="beGoodAtText">
						<b>擅长：</b><span>脑动脉瘤、脑血管畸形、硬脑膜动静脉瘘、外伤性海绵窦动静脉瘘、脊髓血管畸形、颈动脉狭窄、颅内动脉狭窄、脑缺血梗塞的外科治疗。</span>
					</p>
					<p class="introduceText">
						<b>简介：</b><span class="four-overflow">主任医师、教授、博士生导师。 原复旦大学附属华山医院神经外科主任医师；神经外科脑血管病医疗组组长原上海德济医院院长、脑血管病中心主任， 中国首家脑科医生集团——“冬雷脑科医生集团”创始人，  2014年首届中国健康产业医生服创新“奇璞奖”获得者， 中国老年学学会心脑血管病中国老年中国老年学2014年首届中国健康产业2014年首届中国健康产业2014年首届中国健康产业2014年首届中国健康产业 </span>
					</p>
				</div>
			</div>
		</div>
		<div class="doctorTimeAddBox">
			<h1 class="expertTitle">
				<a href="javascript:;">就诊时间及地点</a>
			</h1>
			<div class="doctorTime">
				<span>就诊时间</span>
				<input type="text" value='请选择日期' class="doctorTime_date" id="datePicker" readonly @click="displayDate">
				<input type="text" value='请选择时间段' class="doctorTime_spot" readonly @click="displayTime">
				<div id="dateWrap" class="dateWrap" v-if="showDate"></div><!--日期-->
				<div class="doctorTime_spotList" v-if="showTime">
					<h1 class="spotList_title">选择时间段</h1>
					<div class="spotList_box">
						<div class="spotList_head">
							<p>上午</p>
						</div>
						<div class="morningBox">
							<a href="javascript:;" class="morningA_noClick">08:00-08:20</a>
							<a href="javascript:;">08:00-08:20</a>
							<a href="javascript:;">08:00-08:20</a>
							<a href="javascript:;" class="morningA_click">08:00-08:20</a>
							<a href="javascript:;">08:00-08:20</a>
						</div>
						<div class="spotList_head">
							<p>下午</p>
						</div>
						<div class="afternoonBox">
							<a href="javascript:;" class="afternoonA_noClick">08:00-08:20</a>
							<a href="javascript:;">08:00-08:20</a>
							<a href="javascript:;" class="afternoonA_click">08:00-08:20</a>
						</div>
						<div class="spotList_head">
							<p>晚上</p>
						</div>
						<div class="eveningBox">
							<a href="javascript:;" class="eveningA_noClick">08:00-08:20</a>
							<a href="javascript:;">08:00-08:20</a>
							<a href="javascript:;" class="eveningA_click">08:00-08:20</a>
						</div>
					</div>
				</div>
			</div>
			<div class="doctorAdd">
				<span>就诊地点</span>
				<input type="text" value='请选择城市' class="doctorAdd_city" readonly @click="displayAddress">
				<input type="text" value='请选择看诊地点' class="doctorAdd_add" readonly @click="displayGroup">
				<div class="selectCity"  v-if="showAddress">
					<h1 class="selectCity_title">选择城市</h1>
					<div class="selectCity_List">
						<div class="selectCity_content">
							<h1>上海市</h1>
							<p>
								<a href="javascript:;" class="cityActive">上海</a>
							</p>
						</div>
						<div class="selectCity_content">
							<h1>江苏省</h1>
							<p>
								<a href="javascript:;">常州</a>
								<a href="javascript:;">南京</a>
								<a href="javascript:;">启动</a>
								<a href="javascript:;">如帛</a>
								<a href="javascript:;">宿迁</a>
								<a href="javascript:;">苏州</a>
							</p>
						</div>
						<div class="selectCity_content">
							<h1>江苏省</h1>
							<p>
								<a href="javascript:;">常州</a>
								<a href="javascript:;">南京</a>
								<a href="javascript:;">启动</a>
								<a href="javascript:;">如帛</a>
								<a href="javascript:;">宿迁</a>
								<a href="javascript:;">苏州</a>
							</p>
						</div>
					</div>
				</div>
				<div class="selectDepartment" v-if="showGroup">
					<h1 class="selectCity_title">选择门诊</h1>
					<div class="selectDepartment_list">
						<p class="departmentActive">上海瑞铂门诊部</p>
						<p>上海中山</p>
						<p>上海瑞金医院</p>
						<p>上海瑞铂门诊部</p>
					</div>
				</div>
			</div>
		</div>
		<div class="visitingPersonBox">
			<h1 class="expertTitle">
				<a href="javascript:;">就诊人信息</a>
			</h1>
			<div class="visitingPersonReady">
				<div class="visitingPersonReady_list visitingPersonReady_active">
					<h1><b>陈果群</b>（<span>男</span><i>26岁</i>）</h1>
					<p>123456789</p>
					<p>1212344544456667</p>
					<a href="javascript:;" style="display:block">修改</a>
					<strong style="display:block">默认就诊人</strong>
				</div>
				<div class="visitingPersonReady_list">
					<h1><b>陈果群</b>（<span>男</span><i>26岁</i>）</h1>
					<p>123456789</p>
					<p>1212344544456667</p>
					<a href="javascript:;">修改</a>
					<strong>默认就诊人</strong>
				</div>
				<div class="visitingPersonReady_list">
					<h1><b>陈果群</b>（<span>男</span><i>26岁</i>）</h1>
					<p>123456789</p>
					<p>1212344544456667</p>
					<a href="javascript:;">修改</a>
					<strong>默认就诊人</strong>
				</div>
				<div class="visitingPersonReady_list">
					<h1><b>陈果群</b>（<span>男</span><i>26岁</i>）</h1>
					<p>123456789</p>
					<p>1212344544456667</p>
					<a href="javascript:;">修改</a>
					<strong>默认就诊人</strong>
				</div>
			</div>
			<div class="newAddPerson">
				<h1 class="newAddPersonHead"><span>-</span>新增就诊人</h1>
				<div class="formBox">
					<p class="formList">
						<span>就诊人姓名</span>
						<input type="text">
						<i>*</i>
					</p>
					<p class="formList">
						<span>手机号</span>
						<input type="text">
						<i>*</i>
					</p>
					<p class="formListCode">
						<span>验证码</span>
						<input type="text">
						<a href="javascript:;">获取验证码</a>
						<i>*</i>
					</p>
					<p class="formList">
						<span>证件类型</span>
						<input type="text">
						<i>*</i>
					</p>
					<p class="formList">
						<span>证件号</span>
						<input type="text">
						<i>*</i>
					</p>
					<p class="formSubmit">
						<input type="checkbox" id="default"><label for="default">设为默认就诊人</label>
						<button class="saveBtn">保存</button>
						<button class="cancelBtn">取消</button>
					</p>
				</div>
			</div>
			<div class="illnessText">
				<span>病情描述</span>
				<textarea></textarea>
			</div>
			<div class="uploadImg">
				<span class="uploadImg_title">上传图片</span>
				<div class="imgBox">
					<p class="addImgBtn">
                        <a id='addPic' href="" v-on:click="addPic"><i>+</i>添加图片 </a>
						<!--<span><i>+</i>添加图片</span>-->
						<b>病症部位 / 检查报告 / 请他病情资料</b>
					</p>
                    <!--<div v-if="images.length >0">-->
                        <!--<ul>-->
                            <!--<li v-for="(key,image) in images">-->

                                <!--<img src="image" @click='delImage(key)' />-->
                                <!--<a href="#" style="position: absolute;" @click='delImage(key)'>-->
                                    <!--<span class="glyphicon glyphicon-remove"></span>-->
                                <!--</a>-->
                            <!--</li>-->
                        <!--</ul>-->
                        <!--<button @click="removeImage">移除全部图片</button>-->
                        <!--<button @click='uploadImage'>上传</button>-->
                    <!--</div>-->
					<div class="imgLists">
						<div class="imgS">
							<img src="../image/doctor.png">
							<span>×</span>
						</div>
						<div class="imgS"></div>
						<div class="imgS">
							<img src="../image/doctor.png">
							<span>×</span>
						</div>
					</div>
					<p class="addImgTip">温馨提示：如遇专家停诊，您的订单会被取消，我们会通过4001-108-102通知到您，请保持手机畅通，并及时关注订单状态。</p>
				</div>
			</div>
		</div>
		<div class="visitingTimeBox">
			<div class="visitingTime">
				<span>就诊时间：<b>2016年01月25日 09：00~09·30</b></span>
				<span>就诊地点：<b>上海市江静安区乌鲁木齐路12号</b></span>
				<span>就诊费用：<b>500元</b></span>
				<button>确认预约</button>
			</div>
		</div>
		<!--标准底部-->
        <clinic-foot class="foot"></clinic-foot>
		<!--右边导航栏 -->
        <clinic-right></clinic-right>
	</div>
	<script type="text/javascript" src="../lib/jquery.js"></script>
	<script type="text/javascript" src="../lib/xdlines.jquery.min.js"></script>
	<script type="text/javascript" src="../js/public/zebra_datepicker.src.min.js"></script>
	<script type="text/javascript" src="../lib/vue.min.js"></script>
	<script type="text/javascript" src="../lib/vue-resource.min.js"></script>
	<script type="text/javascript" src="../js/component/component.js"></script>
	<script type="text/javascript" src="../js/public/common.js"></script>
	<script type="text/javascript" src="../js/order.js"></script>
	<script type="text/javascript">
		textOverflow();
	</script>
</body>
</html>